﻿<!DOCTYPE html>
<html>
	<head>
		<meta chartset="UTF-8" />
		<link rel="stylesheet" href="css/com.css" /> 
		<title>购物商城</title>
	</head>
	<body>
		<div class="pg-head">
			<div class="head-top">
				<div class="top-bar">
					<div class="head-collect">收藏本站</div>
					<div class="head-login">
						<table>
							<tr>
								<td style="width:40px">登录</td>
								<td style="width:40px">注册</td>
								<td style="width:60px">我的订单</td>
								<td style="width:60px">我的收藏</td>
								<td style="width:100px">VIP会员俱乐部</td>
								<td style="width:60px">客户服务&#9660</td>
								<td style="width:40px">关注</td>
								<td style="width:50px">手机版</td>
							</tr>
						</table>
					</div>
					<!--<div style="clear:both"></div>-->
				</div>			
			</div>
			<div class="head-logo">
				<div class="space"></div>
				<div class="logo">
					<a href="#">
						<img src="image/logo.gif" alt="年终大促" />
					</a>
				</div>
				<div class="search-bar v-center">
					<div class="search-div">
						<input class="" id="search" type="text" />
						<input id="search-btn" type="button" value="搜索" />
					</div>
					<div class="tips">
						<span>热门搜索：</span>
						<a href="#">火龙果</a>
						<a href="#">大榴莲</a>
					</div>
					<div style="clear:both"></div>
				</div>
				<div class="shopping-car v-center">
					<div class="shopping-bar">
						<span>购物车</span>
						<span class="count">2</span>
						<span>件&#9660</span>

					</div>

				</div>
				<div style="clear:both"></div>
			</div>
		</div>
		<div class="pg-content">
			<div class="menu-bar">
				<div class="menu-div">
					<dl>
						<dt>全部商品分类</dt>
						<dd>
							<div>南方水果</div>
							<span>火龙果</span><span>火龙果</span><span>火龙果</span>
						</dd>
						<dd>
							<div>北方水果</div>
							<span>火龙果</span><span>火龙果</span><span>火龙果</span>
						</dd>
						<dd>
							<div>西方水果</div>
							<span>哈密瓜</span><span>西瓜</span><span>火龙果</span>
						</dd>
						<dd>
							<div>东方水果</div>
							<span>火龙果</span><span>火龙果</span><span>火龙果</span>
						</dd>
					</dl>
					<ul>
						<li name="index">首页</li>
						<li>网上超市</li>
						<li>水果超市</li>
						<li>超级订餐</li>
						<li>生活娱乐</li>
						<li>研究院</li>
					</ul>
					<div class="hot">
						<div>最热</div>
					</div>
					<div class="right-menu-bar">
						<ul>
							<li>研究院</li>
							<li>研究院</li>
							<li>论坛</li>
						</ul>

					</div>
				</div>

			</div>
			<div class="product">
				<div class="product-title">
					<ul>
						<li>食品&gt;</li>
						<li>水果&gt;</li>
						<li>火龙果</li>
					</ul>
				</div>
				<div class="product-list">
					<dl>
						<dt>
							<div>您已选择&#58;</div>
							<a>苹果</a>
						</dt>
						<dd>
							<div>材料&#58;</div>
							<a>苹果</a>
							<a>苹果</a>
							<a>苹果</a>
						</dd>
						<dd>
							<div>品牌&#58;</div>
							<a>苹果</a>
							<a>苹果</a>
							<a>苹果</a>
						</dd>
						<dd>
							<div>风格&#58;</div>
							<a>苹果</a>
							<a>苹果</a>
							<a>苹果</a>
						</dd>
					</dl>
				</div>
				<div class="product-show">
					<div class="product-show-title">
						<div class="title-left">
							<span>排序</span>
							<a href="#">价格</a>
							<a href="#">销量</a>
							<a href="#">最新</a>
						</div>
						<div class="title-right">
							<span>共XX件商品</span>
							<span>1/102</span>
							<input type="button" class="t-btn" value="<" />
							<input type="button" class="t-btn" value=">" />
						</div>
						<div style="clear:both"></div>
					</div>
					<div class="product-div">
						<div class="product-img">
							<img src="" />
						</div>

						<div class="product-name">欧吉龙</div>
						<div class="price">
							<div class="p-price">$69.00</div>
							<div class="p-count">
								<input type="button" value="+" />
								<input type="text" value="1" />
								<input type="button" value="-" />
							</div>
							<input type="button" class="p-btn" value="买"/>
							<div style="clear:both"></div>
						</div>
					</div>
					<script>
						doc_str = "<div class='product-div'>";
						doc_str += "<div class='product-img'>";
						doc_str += "<img src='' />";
						doc_str += "</div>";
						doc_str += "<div class='product-name'>欧吉龙</div>";
						doc_str += "<div class='price'>";
						doc_str += "<div class='p-price'>$69.00</div>";
						doc_str += "<div class='p-count'>";
						doc_str += "<input type='button' value='+' />";
						doc_str += "<input type='text' value='1' />";
						doc_str += "<input type='button' value='-' />";
						doc_str += "</div>";
						doc_str += "<input type='button' class='p-btn' value='买'/>";
						doc_str += "<div style='clear:both'></div>";
						doc_str += "</div>";
						doc_str += "</div>";
						for(var i=0;i<9;i++){
							document.write(doc_str);
						}
					</script>
					<div style="clear:both"></div>
				</div>
				<div style="clear:both"></div>
			</div>
			<div style="clear:both"></div>
		</div>
		<div class="pg-footer">
			<div class="tel">
				<div class="tel-text1">24小时服务热线</div>
				<div class="span-red number">400&nbsp;0098666</div>
				<div class="tel-text2">
					<span>截止今日，垂标网在全国已有办事处</span>
					<span class="span-red">162</span>
					<span>家</span>
				</div>
				<div class="tel-link">
					<a href="#">查看全国办事处</a>
				</div>

			</div>
			<div class="about">
				<dl>
					<dt>关于垂标网</dt>
					<dd>公司简介</dd>
					<dd>CEO致辞</dd>
					<dd>体验馆</dd>
					<dd>诚聘英才</dd>
					<dd>联系我们</dd>
				</dl>
				<dl>
					<dt>新手指南</dt>
					<dd>注册新用户</dd>
					<dd>订购家具流程</dd>
					<dd>体验馆购买指导</dd>
					<dd>付款方式</dd>
					<dd>常见问题解答</dd>
				</dl>
				<dl>
					<dt>配送安装</dt>
					<dd>收货指南</dd>
					<dd>体验馆服务费</dd>
					<dd>物流配送</dd>
				</dl>
				<dl>
					<dt>售后服务</dt>
					<dd>45天无理由退货</dd>
					<dd>如何申请退款</dd>
					<dd>维修补件说明</dd>
				</dl>
				<dl>
					<dt>购物保障</dt>
					<dd>正品保证</dd>
					<dd>注册协议</dd>
					<dd>隐私保护</dd>
					<dd>免责声明</dd>
				</dl>
			</div>
			<div class="qrcode">
				<div style="font-weight:600;font-size:16px;">第8哥微信公众号</div>
				<div>
					<img src="image/qrcode.png" />
				</div>
				<div style="font-weight:600;">关注有惊喜&nbsp;好礼马上到</div>
				<div style="clear:both"></div>
			</div>
		</div>
	</body>
</html>